<template>
  <div class="footer">
    <div class="footer-wrapper">
      <p class="footer-title">北京绿凯园林工程有限公司</p>
      <div class="footer-middle">
        <p class="links">
          <router-link to="/">
            <span class="link">
              公司简介
            </span>
          </router-link>
          <router-link to="/desc">
            <span class="link">
              项目介绍
            </span>
          </router-link>
          <router-link to="/business">
            <span class="link">
              相关业务
            </span>
          </router-link>
          <router-link to="/contact">
            <span class="link" style="border:none">
              联系我们
            </span>
          </router-link>
        </p>
        <p class="mail">
           商务合作：wuoeeeee@163.com | 投递简历：wuoeeeee@163.com
        </p>
      </div>
    </div>
    <p class="foooter-bottom">
      版权所有：绿凯园林 备案号：京ICP备19049235号 技术支持：新墨科技
    </p>
  </div>
</template>

<script>
export default {
  name: "Footer",
  data() {
    return {};
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.footer {
  background: #3e3e3e;
  width: 100%;
  height: 170px;
  color: white;
  text-align: left;
  padding-top: 40px;
  box-sizing: border-box;
  font-size: 16px;
  .footer-wrapper {
    width: 1200px;
    margin: 0 auto;
    .footer-title {
      font-size: 26px;
    }
    .footer-middle {
      margin-top: 24px;
      display: flex;
      .links {
        color: white;
        .link {
          color: white;
          margin-right: 2px;
          padding:0 4px;
          border-right: 1px solid white;
        }
      }
      .mail {
        margin-left: 40px;
      }
    }
  }
  .foooter-bottom {
    margin-top: 30px;
    border-top: 1px solid #353535;
    line-height: 40px;
    text-align: center;
    width: 100%;
    background: #3e3e3e;
  }
}
</style>
